<template>
  <div class="qualifications">
    <div class="layout">
      <div class="page-title">
        <span>临床药物实验指南：</span>
      </div>
    </div>
    <div class="qualifications-main">
      <div
        v-for="item in qualificationsList"
        :key="item.JDBM"
      >
        <h4>{{item.JDMC}}</h4>
        <div class="qualifications-main-text">
          {{item.NR}}
        </div>
        <div>
          <img
            :src="item.imgURL"
            alt=""
          >
        </div>
      </div>
    </div>
  </div>
</template>
<script>
import { getYYXXAPI } from '@/api/index.js';
export default {
    data() {
        return {
            qualificationsList: []
        };
    },
    mounted() {
        this.qualificationsData();
    },
    methods: {
        // 获取临床试验药物流程数据
        async qualificationsData() {
            const res = await getYYXXAPI({
                cxlx: 'Query_YYZN'
            });
            if (res.code == 'succ') {
                this.qualificationsList = res.result;
            }
        }
    }
};
</script>
<style scoped>
.qualifications {
    width: 100%;
    font-size: 1.3rem;
    min-height: 100vh;
}
.qualifications-main {
    width: 90%;
    margin: 20px auto;
    padding: 15px;
    box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
}
.qualifications-main-text {
    display: flex;
    align-items: center;
    line-height: 40px;
    font-size: 1.3rem;
    text-indent: 2rem;
}
.qualifications-main-content {
    text-indent: 2rem;
}
.briefly-content,
.work-content {
    text-indent: 4rem;
    line-height: 40px;
    font-size: 1.3rem;
}
</style>